<!DOCTYPE html>
<html>
<head>
    <title>课程新增视频</title>
    {% include 'admin/common/header.html' %}
</head>
<body>
<form class="layui-form">
    <div class="mainBox">
        <div class="main-container">
            <div class="main-container">
                <div class="layui-form-item">
                    <label class="layui-form-label">视频标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="videoTitle" lay-verify="title" autocomplete="off"
                               placeholder="请输入标题"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">视频编码</label>
                    <div class="layui-input-block">
                        <input type="text" name="videoCode" lay-verify="title" autocomplete="off"
                               placeholder="请输入标题"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">课程描述</label>
                    <div class="layui-input-block">
                        <input type="text" name="courseDetail" lay-verify="title" autocomplete="off"
                               placeholder="请输入标题"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">上传视频</label>
                    <div class="layui-input-block">
                        {#                        <button type="button" name="uploadButton" class="layui-btn">上传视频</button>#}
                        {#                        <input type="file" name="fileUpload" lay-verify="file" lay-type="file">#}
                        <a type="button" class="layui-btn layui-btn-normal upload" id="up_btn">

                            <input class="change" type="file" multiple="multiple" id="files"/>

                            <i class="fa fa-upload"></i>上传音频

                        </a>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit="" lay-filter="user-save">
                <i class="layui-icon layui-icon-ok"></i>
                提交
            </button>
            <button type="reset" class="pear-btn pear-btn-sm">
                <i class="layui-icon layui-icon-refresh"></i>
                重置
            </button>
        </div>
    </div>
</form>
{% include 'admin/common/footer.html' %}
<script>
    layui.use(['form', 'jquery'], function () {
        let form = layui.form
        let $ = layui.jquery
        form.on('submit(user-save)', function (data) {
            let roleIds = ''
            $('input[type=checkbox]:checked').each(function () {
                roleIds += $(this).val() + ','
            })
            roleIds = roleIds.substr(0, roleIds.length - 1)
            data.field.roleIds = roleIds

            $.ajax({
                url: '/course/details/add',
                data: JSON.stringify(data.field),
                dataType: 'json',
                contentType: 'application/json',
                type: 'post',
                success: function (result) {
                    if (result.success) {
                        layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                            parent.layer.close(parent.layer.getFrameIndex(window.name))//关闭当前页
                            parent.layui.table.reload('call-table')
                        })
                    } else {
                        layer.msg(result.msg, {icon: 2, time: 1000})
                    }
                }
            })
            return false
        })
    })
</script>
<style>

    .upload {

        padding: 4px 10px;
        height: 20px;
        position: relative;

    }

    .change {

        position: absolute;
        overflow: hidden;
        right: 0;
        top: 0;
        opacity: 0;

    }</style>
</body>
</html>